window.onload = function(){
    var listUrl = "http://192.168.4.18:3000/top/playlist?cat=华语";
    var bannerUrl = "http://192.168.4.18:3000/top/playlist?cat=华语";
    /* 发送http请求 */
    /* 发送列表页http */
    ajax({
        url:listUrl,
        success: res => {
            handleListHttpData(res)
        }
    })

    /* ajax({
        url,success:res=>{
            // 处理数据将请求数据添加到dom上
            var {playlists} = res;
            var results = playlists.slice(0,8);
            result.forEach(item=>{
                var {name,coverImgUrl,playCount} = item;
                array.push({
                    name,coverImgUrl,
                    playCount
                })
            })
            console.log(arr)
        }
    }) */

    /* 2.处理数据将数据添加到DOM上 */
    function handleListHttpData(res) {
        var { playlists } = res;
        var results = playlists.slice(0, 8);
        var musics = [];
        results.forEach(item => {
            var { name, coverImgUrl, playCount } = item;
            playCount = handleNum(playCount);
            musics.push({
                name,
                coverImgUrl,
                playCount
            })
        })
        musics.forEach((value,index)=>{
            var template = `
            <div>
                <img src=${value.coverImgUrl} alt="">
                <div class="opcity">
                    <i class="iconfont icon-erji"></i>
                    <em>${value.playCount}</em>
                    <a href="#"><i class="iconfont icon-bofang1" style="color: #ccc;"></i></a>
                </div>
                <p><a href="#">${value.name}</a></p>
             </div>
           `
           $(".hot-content").append(template);
        })
        
    }

    //渲染轮播的数据
    /*  banner发送http*/
    ajax({
        url:bannerUrl,
        success:res=>{
            handleBannerHttpData(res)
        }
    })
 
    function handleBannerHttpData(res){
        var {banners} = res;
        console.log(banners)
        banners.forEach(item=>{
            var template = `
            <img src="${item.imageUrl}">
            `
            $('#list').append(template);
        })
    }
    ajax({
        url:bannerUrl,
        success:res=>{
            handleBannerHttpData(res)
        }
    })
 
    function handleBannerHttpData(res){
        var {banners} = res;
        console.log(banners)
        banners.forEach(item=>{
            var template = `
            <img class="filter" src="${item.imageUrl}">
            `
            $('#lb-bg').append(template);
        })
    }
 }

    /* function handleHttpData(){
        var {playlists} = res;
            var results = playlists.slice(0,8);
            var arr =[];
            result.forEach(item=>{
                var {name,coverImgUrl,playCount} = item;
                array.push({
                    name,coverImgUrl,
                    playCount
                })
            })
            console.log(arr)
    }

    function handleNum(num){
        if(num>=10000){
            return Math.floor(num/100000000)+"亿"
        }else if(num>10000){
            return Math.floor(num/10000)+"万"
        }
        return num;
    } */